<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	@@include('public/title.html')
	<meta http-equiv="X-UA-Compatible" content="chrome=1,IE=edge">
	<link href="../../css/bootstrap.min.css" rel="stylesheet">
	<link href="css/nifty.min.css" rel="stylesheet">
	<link href="../../css/demo/nifty-demo-icons.min.css" rel="stylesheet">
	<link href="../../plugins/font-awesome/css/font-awesome.min.css" rel="stylesheet">
	<link href="../../css/user_defined.css" rel="stylesheet">
	<link href="../../plugins/pace/pace.min.css" rel="stylesheet">
	<script src="../../plugins/pace/pace.min.js?2016/8/5"></script>
	<script src="../../js/jquery-2.2.1.min.js"></script>

</head>

<!--TIPS-->
<!--You may remove all ID or Class names which contain "demo-", they are only used for demonstration. -->

<body id="main">
<div id="container" class="effect mainnav-lg">
	@@include('public/header.html')
	<div class="boxed">
		<div id="content-container">
			<div id="page-title">
				<h1 class="page-header text-overflow">联盟商户门店详情</h1>
			</div>
			<style>
				.panel table td{
					padding:7px 0;
				}
				td , th{
					font-size:18px;
				}
				.panel{
					margin:20px;
				}
				.panel-heading{
					font-weight: 800;
					font-size:20px;
					padding:10px 20px;
					border-bottom:1px solid #efefef;
					height:auto;
					color:#777;
				}
				.panel-heading:after{display:none!important;}
				
				.base_info td:first-child:after{
					content:":";
					padding:0 8px;
				}
				td button{
					margin-left:15px;
				}
			</style>
			<!--城市合伙人基本信息-->
			<div class="panel">
				<div class="panel-heading">
					<span>基本信息</span>
					<button class="btn btn-primary" style="margin-left:10px;" v-on:click="showModal()">修改</button>
				</div>
				<div class="panel-body">
					<table class="base_info">
						<tr>
							<td>门店名称</td>
							<td>
								<span v-text="partner.m_name"></span>
							</td>
						</tr>
						<tr>
							<td>负责区域</td>
							<td>
								<span v-text="partner.region"></span>
							</td>
						</tr>
						<tr>
							<td>营业状态</td>
							<td>
								<span v-text="statuses[partner.m_status]"></span>
							</td>
						</tr>
						<tr>
							<td>管理账号</td>
							<td>
								<span v-text="partner.m_account"></span>
							</td>
						</tr>
						<tr>
							<td>登陆密码</td>
							<td>
								<span>******</span>
								<button class="btn btn-primary" data-toggle="modal" data-target="#changePwd">修改</button>
							</td>
						</tr>
					</table>
				</div>
			</div>
			
			<!--城市合伙人数据信息-->
			<div class="panel">
				<div class="panel-heading">门店信息</div>
				<div class="panel-body">
					<table class="base_info">
						<tr>
							<td>门店电话</td>
							<td v-text="partner.m_tel"></td>
						</tr>
						<tr>
							<td>门店地址</td>
							<td>
								<span v-text="partner.m_address"></span>
							</td>
						</tr>
						<tr>
							<td>营业时间</td>
							<td>
								<span v-text="partner.m_business_hours"></span>
							</td>
						</tr>
					</table>
				</div>
			</div>
			
			<!--城市合伙人数据信息-->
			<div class="panel">
				<div class="panel-heading">门店信息</div>
				<div class="panel-body">
					<table class="base_info">
						<tr>
							<td>订单总数</td>
							<td>
								<span v-text="order_count"></span>
							</td>
						</tr>
					</table>
				</div>
			</div>
		</div>
		
		<nav id="mainnav-container">
			@@include('public/left_menu.html')
		</nav>
	</div>
	
	
	<!-- 模态框（Modal） -->
	<div class="modal fade" id="changeCity" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h4 class="modal-title" id="myModalLabel">修改负责城市</h4>
				</div>
				<div class="modal-body">
					<style>
						form{
							text-align: center;
						}
						form select, form input{
							width:200px;
							margin:15px 0;
							padding:5px;
						}
					</style>
					<validator name="validation">
						<style>
							table.form-horizontal{
								width:100%;
							}
							label{
								display:inline-block;
								vertical-align: middle;
							}
							label input{
								display:none;
							}
							label div{
								padding:4px 10px;
								margin-right:20px;
								border:1px solid #ccc;
							}
							label input:checked + div{
								background:#ff9800;
								color:#fff;
								border-color: #ff9800;
							}
							.form-horizontal td{padding:10px;}
							.form-horizontal td{padding:10px;}
							.form-horizontal td:first-child{text-align: right;}
							.form-horizontal input, .form-horizontal select{
								width:100%;
								padding:4px;
							}
						</style>
						<table class="form-horizontal">
							<tr>
								<td>门店名称 : </td>
								<td><input type="text" v-model="newmember.m_name" v-validate:newmember.m_name="{required: true}"></td>
							</tr>
							<tr>
								<td>门店电话 : </td>
								<td><input type="text" v-model="newmember.m_tel" v-validate:newmember.m_tel="{required: true}"></td>
							</tr>
							<tr>
								<td>负责区域 : </td>
								<td>
									<select v-model="newmember.re_id" v-validate:newmember.re_id="{required:true}">
										<option>选择区域</option>
										<option v-for="r in regions" value="{{r.re_id}}" v-text="r.region"></option>
									</select>
								</td>
							</tr>
							<tr>
								<td>营业状态 : </td>
								<td>
									<label>
										<input type="radio" name="status" v-model="newmember.m_status" v-validate:newmember.m_status="{required: true}" value="0">
										<div>停业</div>
									</label>
									<label>
										<input type="radio" name="status" v-model="newmember.m_status" v-validate:newmember.m_status="{required: true}" value="1">
										<div>营业</div>
									</label>
								</td>
							</tr>
							<tr>
								<td>门店地址 : </td>
								<td><input type="text" v-model="newmember.m_address" v-validate:newmember.m_address="{required: true}"></td>
							</tr>
							<tr>
								<td>营业时间 : </td>
								<td><input type="text" v-model="newmember.m_business_hours" v-validate:newmember.m_business_hours="{required: true}"></td>
							</tr>
						</table>
					</validator>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" v-on:click="savePartner()" :disabled="!$validation.valid">确定修改</button>
				</div>
			</div><!-- /.modal-content -->
		</div><!-- /.modal-dialog -->
	</div>
	
	<!--修改密码-->
	<div class="modal fade" id="changePwd" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
					<h4 class="modal-title">修改门店密码</h4>
				</div>
				<div class="modal-body">
					<validator name="validation2">
						<table class="form-horizontal">
							<tr>
								<td>密码 : </td>
								<td><input type="text" v-model="newpwd" v-validate:newpwd="{required: true}"></td>
							</tr>
						</table>
					</validator>
				</div>
				<div class="modal-footer">
					<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-primary" v-on:click="changePwd()" :disabled="!$validation2.valid">确定添加</button>
				</div>
			</div>
		</div>
	</div>
	
	
@@include('public/footer.html')
<script>
	var memberId = getQueryString("member_id");
	var vue = new Vue({
		el: '#main',
		data: {
			partner:{},
			"cities":[],
			"provinces":[],
			"newmember":null,
			"newpwd":"",
			statuses:["关闭","开启"],
			order_count:"",
			regions:''
		},
		methods: {
			/*打开窗口*/
			openWin:function(url, member){
				var win = window.open(url+member.member_id, '', "width=650,scrolling=no,height=400,resizable=0,top=150,left=0");
			},
			
			/*添加城市合伙人*/
			savePartner:function(model){
				$.post(apiRecycle+"partner.php/Admin/UnionStore/edit_union_store", vue.newmember, function(res){
					if(res.code==200){
						location.reload();
					} else {
						alert(res.message);
					}
				}, "json");
			},
			
			showModal:function(){
				var baseInfo = vue.partner;
				vue.newmember = {
					member_id:baseInfo.member_id,
					m_name:baseInfo.m_name,
					m_status:baseInfo.m_status,
					m_address:baseInfo.m_address,
					m_business_hours:baseInfo.m_business_hours,
					re_id:baseInfo.re_id,
					m_tel:baseInfo.m_tel
				};
				
				$("#changeCity").modal("show");
			},
			
			/*修改密码*/
			changePwd:function(){
				$.post(apiRecycle+"partner.php/Admin/UnionStore/edit_union_store", {
					"m_pwd":vue.newpwd,
					"member_id":vue.partner.member_id,
				}, function(res){
					if(res.code==200){
						location.reload();
					} else {
						alert(res.message);
					}
				}, "json");
			},
			
			/*跳转到城市合伙人详情页面*/
			partnerDetail:function(p){
				location.href = "city_partner_detail.html?member_id="+p.member_id;
			}
		},
		ready: function () {
			var thiz = this;
			/*加载合伙人详情*/
			$.post(apiRecycle+"partner.php/Admin/UnionStore/get_union_store", {member_id:memberId}, function(res){
				vue.partner = res.data;
			}, "json")
			
			/*获取订单数*/
			$.get(apiRecycle+"partner.php/Admin/Order/get_member_order_count", {member_id:memberId}, function(res){
				thiz.order_count = res.data.total;
			}, "json")
			
			var thiz = this;
			$.get(apiRecycle+"partner.php/Admin/UnionStore/get_area", {}, function(res){
				thiz.regions = res.data;
			}, "json")
		}
	});
</script>
</body>
</html>
